<template>
  <div class="content">
    <div class="foster-content">
      <!-- 培育统计 -->
      <div class="point-condition module">
        <div class="common-head">
          <div class="common-sub-title">
            <img src="~assets/img/icon_tj.png" alt="培育统计">
            <span>培育统计</span>
          </div>
        </div>
        <div class="module-list module-long-border">
          <div class="common-item "><span>本日统计:</span><span class="num" v-text="carrent_price+'元'"></span><div class="more"><router-link to="/foster_more" tag="span" class="more">查看更多<img src="~assets/img/icon_arr_green.png" alt=""></router-link></div></div>
          <div class="common-item"><span>培育累计：</span><span class="num" v-text="total_prize+'元'"></span></div>
        </div>
      </div>
      <!-- 培育说明 -->
      <div class="foster-descr">
        <div class="common-sub-title">
          <img src="~assets/img/icon_detail.png" alt="培育统计">
          <span>培育说明</span>
        </div>
        <div class="descr">
          <ol>
            <li>培育奖是只针对于钻卡、VIP卡等级的用户才享有的特殊奖励。</li>
            <li>钻卡、VIP卡等级的用户直接推荐新用户A，该新用户A为一级，A直接推荐用户B，B为二级，B再推荐新用户C，C为三级</li>
            <li>提成比例：
              <p>一级：50%，用户自身量碰达到2W可拿</p>
              <p>二级：30%，用户自身量碰达到4W可拿</p>
              <p>三级：20%，用户自身量碰达到8W可拿</p>
            </li>
            <li>培育奖=不同等级量碰收人*提成比例</li>
          </ol>
        </div>
      </div>
      <!-- 备注 -->
      <div class="remark tc">注：奖励最终解释权归艾鑫集团所有</div>
    </div>
  </div>
</template>

<script>
import { apiPost } from 'src/common/api.js'
export default {
  name: 'HelloWorld',
  data () {
    return {
      carrent_price: 0,
      total_prize: 0
    }
  },
  mounted () {
    // this.test()
    this.getFosterInfo()
  },
  methods: {
    // 获取我的培育信息
    getFosterInfo () {
      apiPost('user_cultivation',
        {}).then((res) => {
        if (res.status === 0) {
          let data = res.data
          this.carrent_price = data.carrent_price
          this.total_prize = data.total_prize
        } else {
          console.log(res.msg)
        }
      })
    }
  }
}
</script>
<style scoped lang='scss'>
  @import '~lib/reset.scss';
  .foster-content {
    margin-top: 10px;
    .common-head {
      padding:0 16px;
      .common-sub-title {
        .point-rule {
          float: right;
          span {
            font-size: $font-12;
          }
          img {
            width: 12px;
            height: 12px;
            margin-left: 10px;
          }
        }
      }
    }
    .module-list {
      padding:0 16px 0 16px;
      .more {
        float: right;
        span {
          vertical-align: middle;
            img {
            height: 12px;
            margin-left: 10px;
          }
        }
      }
    }
    .module-long-border {
      border-bottom: 1px solid #e5e5e5;
      div:last-child {
        border-bottom: none;
      }
    }
    .module {
      .item {
        padding: 0 16px;
      }
    }
    .foster-descr {
      margin-top: 10px;
      background-color: #fff;
      padding:0 16px 50px 16px;
      ol {
        list-style: decimal;
        padding: 16px 16px 0 16px;
        li {
          font-size: $font-15;
          line-height: 2;
        }
      }
    }
    .remark {
      margin: 10px 40px;
    }
  }
</style>
